<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>非等间距坐标</title>
</head>
<script src="https://cdn.bootcdn.net/ajax/libs/echarts/5.1.2/echarts.common.js"></script>
<!-- <script src="https://cdn.bootcdn.net/ajax/libs/echarts/4.9.0-rc.1/echarts-en.common.min.js"></script> -->
<body>
    <div id="echarts" style="height: 300px;width:800px"></div>
</body>
<script>
    let myChart = window.echarts.init(document.getElementById('echarts'));
 
    let option = {
      tooltip: { trigger: 'axis' },
      xAxis: {
        type: 'value',
        axisLabel: {
            //   color: "#000",
            //   margin: 20,     
              interval:1
            },
            splitLine: {
              show: true,
              // color: '#ccc',
              lineStyle: {
                color: "#686A73",
                type: "dotted",
              },
            },
      },
      yAxis: [{ type: 'value' },{type: 'value'}],
      series: [
        {
          name: 'Fake Data',
          type: 'line',
          smooth: true,
          data: [
            [0, 10],
            [2, 20],
            [5, 30],
            [10, 40],
            [20, 50],
            [50, 60],
            [90, 70],
            [100, 75],
          ],                  
        },
        {
          name: 'Fake',
          type: 'line',
          smooth: true,
          data: [
            [0, 20],
            [2, 120],
            [5, 0],
            [10, 40],
            [20, 80],
            [50, 50],
            [90, 20],
            [100, 95],
          ],         
        },
      ],
    };
    myChart.setOption(option);
</script>
</html>